@charset "utf-8";

html {
  overflow-x: hidden;
  width: 100%;
  height: 100%;
}

body {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  background: #171821;
  color: #fff;
}

.head-svga {
  width: 100%;
  height: 7.95rem;
  background: black;
  position: relative;
}

.rewardRules {
  padding-top: 1.9rem;
  display: flex;
  justify-content: space-between;
  position: absolute;
  width: 100%;
  left: 0;
  top: 0.5rem;
  z-index: 1;
}

.rewardRules .left {
  width: 0.8rem;
  height: 0.65rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/26.png') no-repeat center / 100% 100%;
}

.rewardRules .right {
  width: 0.8rem;
  height: 0.65rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/27.png') no-repeat center / 100% 100%;
}

.rewardRules-bottom {
  position: absolute;
  bottom: 0;
  left: 1.6rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.rewardRules-bottom .rew-gift {
  width: 1.46rem;
  height: 1.31rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/gift4.png') no-repeat center / 100% 100%;
}

.rewardPop-up {
  /* text-align: center; */
}

.rewardPop-up .rewardPop-head {
  text-align: center;
  width: 7.5rem;
  height: 2.53rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/33.png') no-repeat center / 100% 100%;
}

.rewardPop-up .rewardPop-head .rewardPop-con {
  width: 6.2rem;
  height: 2.35rem;
  transform: translate(0.44rem, 0.46rem);
  margin-left: 0.15rem;
}

.rewardPop-up .rewardPop-head .rewardPop-context {
  transform: translate(-0.2rem, 0.1px);
  margin-right: 13px;
  width: 6.7rem;
  height: 1.93rem;
  background-color: #352827;
  border-radius: 0.1rem;
  display: flex;
  justify-content: center;
}

.rewardPop-up .rewardPop-head .rewardPop-context .rewardPop-text {
  padding-top: 0.1rem;
  height: 2rem;
  font-family: PingFang-SC-Bold;
  font-size: 0.22rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.32rem;
  letter-spacing: 0rem;
  color: #ffeb85;
  width: 6.3rem;
}

.rewardPop-up .rewardPop-inMiddle {
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/34.png') no-repeat center / 100% 100%;
  width: 7.5rem;
  height: 2.635rem;
}

.rewardPop-up .rewardPop-inMiddle .inMiddle-text {
  text-align: center;
  font-family: PingFang-SC-Bold;
  font-size: 0.22rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.32rem;
  letter-spacing: 0rem;
  color: #ffeb85;
  margin-left: 0.44rem;
  margin-right: 0.44rem;
}

.rewardPop-up .rewardPop-follow {
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/35.png') no-repeat center / 100% 100%;
  width: 7.5rem;
  height: 0.5rem;
}

.tanc {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  height: 220%;
  background-color: rgba(0, 0, 0, 0.5);
}

.rankopenWindow {
  position: absolute;

  left: -1rem;
  top: .2rem;
  z-index: 7;
  width: 6rem;
  height: 7rem;
  width: 7.2rem !important;
  height: 7.2rem;
  background-color: rgba(0, 0, 0, 0.5);
}




.rewardPop-open {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 11;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}

.attack {
  display: flex;
  justify-content: space-around;
  margin-left: 0.4rem;
  margin-right: 0.4rem;
  padding-top: 0.2rem;
}

.attack-c {
  width: 1.2rem;
  height: 1.2rem;
  background-color: #3c0f1a;
  box-shadow: inset 0rem 0.02rem 0.1rem 0rem #0d0727;
  border-radius: 0.14rem;
  border: solid 0.02rem #f8df7b;
  display: flex;
  justify-content: center;
  align-items: center;
}

.attack-c .attack-img {
  width: 1.2rem;
  height: 1.2rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/gift1.png') no-repeat center / 100% 100%;
}

.attack-c .attack-imgb {
  width: 1.2rem;
  height: 1.2rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/gift2.png') no-repeat center / 100% 100%;
}

.attack-c .attack-imgc {
  width: 1.2rem;
  height: 1.2rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/gift3.png') no-repeat center / 100% 100%;
}

.attack-c .attack-imgd {
  width: 1.2rem;
  height: 1.2rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/gift4.png') no-repeat center / 100% 100%;
}

.attack-d {
  width: 1.2rem;
  height: 0.42rem;
  display: flex;
  justify-content: center;
  text-align: center;
  padding-top: 0.1rem;
}

.attack-e {
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/24.png') no-repeat center / 100% 100%;
  width: 0.3rem;
  height: 0.3rem;
}

.attack-num {
  width: 0.4rem;
  height: 0.18rem;
  font-family: PingFang-SC-Medium;
  font-size: 0.24rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.32rem;
  letter-spacing: 0rem;
  color: #ffeb85;
}

.aMonster ul {
  display: flex;
  justify-content: space-around;
}

.aMonster li {
  white-space: nowrap;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3.34rem;
  height: 0.84rem;
  font-family: PingFang-SC-Bold;
  font-size: 0.2rem;
  font-weight: normal;
  font-stretch: normal;
  letter-spacing: 0rem;
  color: #f4cb7d;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/button_options2.png') no-repeat center / 100% 100%;
}

.aMonster li .text {
  width: 3.07rem;
  height: 0.16rem;
  font-family: PingFang-SC-Bold;
  font-size: 0.2rem;
  font-weight: normal;
  font-stretch: normal;
  letter-spacing: 0rem;
  color: #f4cb7d;
}

.aMonster .active {
  width: 3.34rem;
  height: 0.84rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/button_options1.png') no-repeat center / 100% 100%;
  color: #5a1b02;
}

.monster-text {
  width: 6rem;
  height: 2.23rem;
}

.monster-inMiddle-a {
  height: 9.28rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/34.png') no-repeat center / 100% 100%;
}

.monster-footer {
  height: 0.5rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/35.png') no-repeat center / 100% 100%;
}

.TOp-rank {
  z-index: 7;
  margin: 2rem auto;
  width: 6.08rem;
  height: 8.4rem;
  background-color: #25080f;
}

.TOp-rank-find {
  margin: 15rem auto;
  width: 6.08rem;
  height: 8.4rem;
  background-color: #25080f;
}

.TOp-rank .Top-hear {
  position: relative;
  height: 0.5rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/tk1.png') no-repeat center / 100% 100%;
}

.TOp-rank .Top-hear .Top-hears {
  text-align: center;
  position: absolute;
  left: 0.7rem;
  top: -0.22rem;
  width: 4.72rem;
  height: 0.64rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/8b9b8ebbd0be0f072959e683142761f.png') no-repeat center / 100% 100%;
  font-family: PingFang-SC-Bold;
  font-size: 0.26rem;
  font-weight: bold;
  font-stretch: normal;
  letter-spacing: 0rem;
  color: #6f2204;
  line-height: 0.7rem;
}

.TOp-rank .Top-hear .Top-close {
  width: 0.64rem;
  height: 0.64rem;
  position: absolute;
  right: 0rem;
  top: 0rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/decc9b5eeb5e21ef4462cf2a3d6f7b2.png') no-repeat center / 100% 100%;
}

.TOp-rank .Top-inMiddle {
  height: 7.4rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/tk2.png') no-repeat center / 100% 100%;
  overflow-y: scroll;
}

.TOp-rank .Top-inMiddle .attackRank {
  display: flex;
  height: 0.822rem;
  justify-content: center;
  align-items: center;
}

.TOp-rank .Top-inMiddle .left {
  flex: 1;
}

.TOp-rank .Top-inMiddle .left .num {
  display: flex;
  justify-content: center;
  align-items: center;
}

.TOp-rank .Top-inMiddle .left .num span {
  text-align: center;
  width: 0.4rem;
  height: 0.38rem;
  font-family: PingFang-SC-Bold;
  font-size: 0.24rem;
  font-weight: normal;
  font-stretch: normal;
  letter-spacing: 0.002rem;
  color: #fee984;
  box-shadow: 0rem 0.01rem 0rem 0rem rgba(45, 8, 13, 0.5);
}

.TOp-rank .Top-inMiddle .left .num img {
  width: 0.64rem;
  height: 0.64rem;
  background-color: #8c201d;
  border: solid 0.02rem #ffeb85;
  margin-left: 0.2rem;
  border-radius: 50%;
}

.TOp-rank .Top-inMiddle .middle {
  flex: 2;
  font-family: PingFang-SC-Regular;
  font-size: 0.24rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.36rem;
  letter-spacing: 0rem;
  color: #ffffff;
}

.TOp-rank .Top-inMiddle .right {
  flex: 1;
}

.TOp-rank .Top-inMiddle .right .attack-r {
  display: flex;
}

.TOp-rank .Top-inMiddle .right img {
  width: 0.29rem;
  height: 0.25rem;
}

.TOp-rank .Top-inMiddle .right span {
  width: 0.62rem;
  height: 0.17rem;
  font-family: PingFang-SC-Medium;
  font-size: 0.22rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.32rem;
  letter-spacing: 0rem;
  color: #ffeb85;
  box-shadow: 0rem 0.01rem 0rem 0rem rgba(45, 8, 13, 0.5);
}

.TOp-rank .Top-foot {
  height: 0.5rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/tk3.png') no-repeat center / 100% 100%;
}

.attackRank-a {
  margin-top: 0.2rem;
  margin-left: 0.21rem;
  display: flex;
  width: 5.68rem;
  height: 1.24rem;
  justify-content: center;
  align-items: center;
  background: #361815;
}

.middles {
  display: flex;
  flex-direction: column;
  flex: 2;
  font-family: PingFang-SC-Regular;
  font-size: 0.24rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.36rem;
  letter-spacing: 0rem;
  color: #ffffff;
}

.middles .middle-a {
  display: flex;
}

.middles .middle-a span {
  width: 0.62rem;
  height: 0.17rem;
  font-family: PingFang-SC-Medium;
  font-size: 0.22rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.32rem;
  letter-spacing: 0rem;
  color: #ffeb85;
  box-shadow: 0rem 0.01rem 0rem 0rem rgba(45, 8, 13, 0.5);
}

.recompensa {
  text-align: center;
  line-height: 1rem;
  width: 6.1rem;
  height: 1.2rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/758856446f82bf801d94c71a88ce714.png') no-repeat center / 100% 100%;
  font-family: PingFang-SC-Bold;
  font-size: 0.26rem;
  font-weight: normal;
  font-stretch: normal;
  letter-spacing: 0rem;
  color: #ffeb85;
}

.recompensa-text {
  width: 5.4rem;
  height: 1.5rem;
  text-align: center;
  font-family: PingFang-SC-Bold;
  font-size: 0.22rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.32rem;
  letter-spacing: 0rem;
  color: #ffeb85;
  display: flex;
  justify-content: center;
  /* align-items: center; */
  margin-left: 0.4rem;
}

/*.swiper-container .swiper-left {*/
/*  z-index: 9;*/
/*  position: absolute;*/
/*  left: 0rem;*/
/*  top: 0rem;*/
/*  width: 0.27rem;*/
/*  height: 0.79rem;*/
/*  background: url('https://oss.chathot.me/action/halloweenDirectory/family/Left_arrow1%402x.png') no-repeat center / 100% 100%;*/
/*}*/
/*.swiper-container .swiper-right {*/
/*  z-index: 9;*/
/*  position: absolute;*/
/*  right: 0rem;*/
/*  top: 0rem;*/
/*  width: 0.27rem;*/
/*  height: 0.79rem;*/
/*  background: url('https://oss.chathot.me/action/halloweenDirectory/family/Right_arrow1%402x.png') no-repeat center / 100% 100%;*/
/*}*/
.monster-inMiddle-ak {
  position: relative;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/34.png') no-repeat center / 100% 100%;
  height: 9rem;
}

/*.monster-inMiddle-ak img {*/
/*  width: 5rem;*/
/*  height: 7.84rem;*/
/*  position: absolute;*/
/*}*/
/*.monster-inMiddle-ak .left,*/
/*.monster-inMiddle-ak .right {*/
/*  width: 4rem;*/
/*  height: 6.84rem;*/
/*  top: 50%;*/
/*  transform: translateY(-50%) rotateY(35deg);*/
/*  opacity: 0.3;*/
/*}*/
/*.monster-inMiddle-ak .left {*/
/*  left: 0.1rem;*/
/*}*/
/*.monster-inMiddle-ak .right {*/
/*  right: 0.1rem;*/
/*}*/
.monster-inMiddle-ak .center {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}

.Top-List {
  text-align: center;
  width: 1.16rem;
  height: 0.34rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/da7df2e28ef9c6dc2858f752c63ae5d.png') no-repeat center / 100% 100%;
  font-family: PingFang-SC-Bold;
  font-size: 0.22rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.32rem;
  letter-spacing: 0rem;
  color: #ffeb85;
  transform: translate(2.12rem, 0.02rem);
}

.List-text {
  text-align: center;
  font-family: PingFang-SC-Bold;
  font-size: 0.22rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.32rem;
  letter-spacing: 0rem;
  color: #ffeb85;
}

.Top-box {
  padding-left: 0.4rem;
  padding-right: 0.4rem;
  height: 5.44rem;
}

.Top-box .dolar {
  width: 1.4rem;
  height: 2rem;
}

.Top-box .dolar .dolar-img {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.4rem;
  height: 1.4rem;
  background-color: #0c0101;
  border-style: solid;
  border-width: 0.03rem;
  border-image-source: linear-gradient(0deg, #e3933e 0%, #ffeb85 100%);
  border-image-slice: 1;
}

.Top-box .dolar .dolar-img img {
height: 100%;
width: 100%;
}

.Top-box .dolar .dolar-text {
  text-align: center;
  width: 1.38rem;
  height: 0.43rem;
  font-family: PingFang-SC-Bold;
  font-size: 0.24rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.24rem;
  letter-spacing: 0rem;
  color: #ffeb85;
}

.List-box {
  display: flex;
  justify-content: space-around;
  padding-top: 0.2rem;
}

.head-svga {
  height: 7.2rem;
}

.head-svga canvas {
  max-height: 7.5rem !important;
  width: 100% !important;
  transform: translate(0, 0) !important;
  -webkit-transform: translate(0, 0) !important;
}

.monster-inMiddle-rank {
  width: 7.1rem;
  height: 2.07rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/MyATKrankingbg.png') no-repeat center / 100% 100%;
  transform: translate(0.26rem, 0.2rem);
  display: flex;
}

.monster-inMiddle-rank .left {
  flex: 1;
  display: flex;
}

.monster-inMiddle-rank .left .monster-inMiddle-rank-num {
  display: flex;
  justify-content: center;
  align-items: center;
}

.monster-inMiddle-rank .left .monster-inMiddle-rank-num .rank-nums-a {
  text-align: center;
  margin-left: 0.2rem;
  margin-right: 0.2rem;
  width: 0.4rem;
  height: 0.38rem;
  font-size: 0.24rem;
  color: #fee984;
  background: #1f121a;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/bd62ab5c56534d797b3aa9b6b787aa9.png') no-repeat center / 100% 100%;
}
.monster-inMiddle-rank .left .monster-inMiddle-rank-num .rank-nums-b{
  text-align: center;
  margin-left: 0.2rem;
  margin-right: 0.2rem;
  width: 0.4rem;
  height: 0.38rem;
  font-size: 0.24rem;
  color: #fee984;
  background: #1f121a;
}

.monster-inMiddle-rank .left .monster-inMiddle-rank-num span {
  width: 0.4rem;
  height: 0.38rem;
  font-family: PingFang-SC-Bold;
  font-size: 0.24rem;
  font-weight: normal;
  font-stretch: normal;
  letter-spacing: 0.002rem;
  color: #fee984;
  margin-right: 0.4rem;
  padding-left: 0.3rem;
}

.monster-inMiddle-rank .left .monster-inMiddle-rank-a {
  width: 1.5rem;
  height: 1.5rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/sfamilyBigicon222x.png') no-repeat center / 100% 100%;
}

.monster-inMiddle-rank .left .monster-inMiddle-rank-a img {
  width: 0.9rem;
  height: 0.84rem;
  background-color: #1d2129;
  border-radius: 0.08rem;
  border: solid 0.04rem #ffeb85;
  position: absolute;
  left: 1.1rem;
  top: 0.5rem;
}

.monster-inMiddle-rank .middle {
  transform: translate(0.16rem, 0.54rem);
  flex: 1;
  display: flex;
  flex-direction: column;
  font-family: PingFang-SC-Bold;
  font-size: 0.24rem;
  font-weight: normal;
  font-stretch: normal;
  letter-spacing: 0.002rem;
  color: #fee984;
}

.monster-inMiddle-rank .middle .rank-i {
  display: flex;
}

.monster-inMiddle-rank .middle .rank-i .ranki-img img {
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
}

.monster-inMiddle-rank .middle .rank-i .ranki-img:nth-child(1) {
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background-color: #0a0606;
  border: solid 0.02rem #ffeb85;


}
.monster-inMiddle-rank .middle .rank-i .ranki-img:nth-child(1) img{
  width: 0.36rem;
  height: 0.36rem;
}
.monster-inMiddle-rank .middle .rank-i .ranki-img:nth-child(2) img{
  width: 0.36rem;
  height: 0.36rem;
}
.monster-inMiddle-rank .middle .rank-i .ranki-img:nth-child(3) img{
  width: 0.36rem;
  height: 0.36rem;
}
.monster-inMiddle-rank .middle .rank-i .ranki-img:nth-child(2) {
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background-color: #0a0606;
  border: solid 0.02rem #acbcc6;
  margin-left: .1rem;
}

.monster-inMiddle-rank .middle .rank-i .ranki-img:nth-child(3) {
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background-color: #0a0606;
  border: solid 0.02rem #b8574a;
  margin-left: .1rem;
}

.monster-inMiddle-rank .right {
  flex: 2;
}

.monster-inMiddle-rank .right .rank-r {
  position: absolute;
  justify-content: center;
  /* transform: translate(0.7
rem
, 1.1
rem
); */
  display: flex;
  top: 1rem;
  right: 0.2rem;
}

.monster-inMiddle-rank .right img {
  width: 0.29rem;
  height: 0.25rem;
}

.monster-inMiddle-rank .right span {
  width: 0.62rem;
  height: 0.17rem;
  font-family: PingFang-SC-Medium;
  font-size: 0.22rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.32rem;
  letter-spacing: 0rem;
  color: #ffeb85;

}

.certify .swiper-slide p {
  font-size: .23rem;
}

.family-text {
  margin-left: .65rem;
  padding-top: 0.63rem;
  text-align: center;
  height: 2.5rem;
  width: 6.2rem;
  font-family: PingFang-SC-Bold;
  font-size: 0.22rem;
  font-weight: normal;
  font-stretch: normal;
  line-height: 0.32rem;
  letter-spacing: 0rem;
  color: #ffeb85;

}

.monster-inMiddle {
  position: relative;
  overflow-y: scroll;
  height: 14.47rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/34.png') no-repeat center / 100% 100%;
}

/*.swiper-container {*/
/*  width: 6.23rem;*/
/*  height: 9.39rem;*/
/*  width: 100%;*/
/*  overflow-x: hidden;*/
/*  position: relative;*/
/*  margin-left: 20px;*/
/*  margin-right: 20px;*/
/*}*/
html,
body {
  position: relative;
  height: 100%;
}

body {
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: #000;
  margin: 0;
  padding: 0;
}

/*.swiper-container {*/
/*  width: 100%;*/
/*}*/
/*.swiper-slide {*/
/*  text-align: center;*/
/*  font-size: 18px;*/
/*  !* Center slide text vertically *!*/
/*  display: -webkit-box;*/
/*  display: -ms-flexbox;*/
/*  display: -webkit-flex;*/
/*  display: flex;*/
/*  -webkit-box-pack: center;*/
/*  -ms-flex-pack: center;*/
/*  -webkit-justify-content: center;*/
/*  justify-content: center;*/
/*  -webkit-box-align: center;*/
/*  -ms-flex-align: center;*/
/*  -webkit-align-items: center;*/
/*  align-items: center;*/
/*  transition: 300ms;*/
/*  transform: scale(0.8);*/
/*}*/
/*.swiper-slide-active,*/
/*.swiper-slide-duplicate-active {*/
/*  transform: scale(1);*/
/*}*/
/*.monster-swiper-a {*/
/*  opacity: 1;*/
/*  z-index: 9;*/
/*  position: absolute;*/
/*}*/
/*.monster-swiper-b {*/
/*  opacity: 0.1;*/
/*  transform: rotateY(10deg);*/
/*}*/
/*.monster-swiper-c {*/
/*  opacity: 0.1;*/
/*  transform: rotateY(10deg);*/
/*}*/
/*.monster-swiper-span {*/
/*  width: 1.08rem;*/
/*  height: 0.2rem;*/
/*  width: 1.08 rem;*/
/*  height: 0.2 rem;*/
/*  font-family: PingFang-SC-Bold;*/
/*  font-size: 0.26rem;*/
/*  font-weight: normal;*/
/*  font-stretch: normal;*/
/*  letter-spacing: 0rem;*/
/*  color: #ffeb85;*/
/*  position: absolute;*/
/*  top: 14px;*/
/*  left: -16px;*/
/*  z-index: 9;*/
/*}*/
/*.monster-swiper-ab {*/
/*  height: 2.7rem !important;*/
/*  width: 3.1rem !important;*/
/*  z-index: 9;*/
/*  position: absolute;*/
/*  left: -0.6rem;*/
/*  top: 1.45rem;*/
/*}*/
/*.monster-swiper-ac {*/
/*  width: 2.27rem !important;*/
/*  height: 0.57rem !important;*/
/*  position: absolute;*/
/*  left: -0.26rem;*/
/*  top: 4.3rem;*/
/*  z-index: 9;*/
/*}*/
/*.monster-swiper-treasure {*/
/*  width: 0.4rem !important;*/
/*  height: 0.4rem !important;*/
/*  position: absolute;*/
/*  left: -0.08rem;*/
/*  bottom: 0.66rem;*/
/*  z-index: 9;*/
/*}*/
/*.treasure-text {*/
/*  font-size: 0.22rem;*/
/*  position: absolute;*/
/*  bottom: 27px;*/
/*  left: 15px;*/
/*  z-index: 9;*/
/*}*/
/*.monster-swiper-life {*/
/*  width: 0.4rem !important;*/
/*  height: 0.4rem !important;*/
/*  position: absolute;*/
/*  left: 0;*/
/*  bottom: 0;*/
/*}*/
/*.monster-swiper-life-imgage {*/
/*  width: 0.2rem !important;*/
/*  height: 0.2rem !important;*/
/*  position: absolute;*/
/*  left: -27px;*/
/*  bottom: 92px;*/
/*}*/
/*.monster-swiper-articleLife {*/
/*  position: absolute;*/
/*  left: -9px;*/
/*  bottom: 88px;*/
/*}*/
/*.monster-swiper-life {*/
/*  position: absolute;*/
/*  height: 2rem;*/
/*  width: 2rem;*/
/*  left: 0;*/
/*  bottom: 0;*/
/*  z-index: 9;*/
/*}*/
.articleBlood {
  position: absolute;
  left: -30px;
  bottom: 74px;
  height: 0.2rem;
  width: 3rem;
  z-index: 9;
}

.articleBlood .articleBlood-bar {
  position: relative;
  height: 0.2rem;
  width: 3rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/xt.png') no-repeat center / 100% 100%;
}

.articleBlood .articleBlood-bar .articleBlood-red {
  width: 50%;
  height: 70%;
  position: absolute;
  background: #701615;
  border-radius: 10px;
  left: 5px;
  top: 1px;
}

/*.monster-inMiddle-ak img {*/
/*  padding-top: 10px;*/
/*  width: 5.9rem !important;*/
/*  height: 9rem !important;*/
/*}*/
/*.monster-swiper-swg-a {*/
/*  opacity: 1;*/
/*  position: absolute !important;*/
/*  z-index: 2;*/
/*}*/
/*.monster-swiper-swg-b {*/
/*  opacity: 0.1;*/
/*  z-index: 1;*/
/*  position: absolute !important;*/
/*}*/
/*.monster-swiper-swg-c {*/
/*  opacity: 0.1;*/
/*  position: absolute !important;*/
/*  z-index: 1;*/
/*}*/
.countdown span {
  font-size: .3rem;
  display: inline-block;
  width: 0.7rem;
  height: 0.4rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/djs.png') no-repeat center/100% 100%;
  margin: 0 0.05rem;
  margin-left: .1rem;
}

.countdown {
  color: #6d0000;
  display: flex;
  text-align: center;
  justify-content: center;
  height: 1rem;
  line-height: .4rem;
  padding-top: 0.4rem;
}

.frankfoo {
  position: absolute;
  width: 7.44rem;
	height: 0.02rem;
  margin-top: .1rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/07bafa2e9dbd1a89a542276ead0fa5f.png') no-repeat center /100% 100%;

}

.underline {
  width: 6rem;
  height: 0.015rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/07bafa2e9dbd1a89a542276ead0fa5f.png') no-repeat center /100% 100%;
}

.Top-lol {
  margin: 0.2rem auto;
  height: 3rem;
  width: 5.4rem;
  background: url('https://oss.chathot.me/action/halloweenDirectory/family/820da3687f0a3dee79e9f6af22e2b04.png') no-repeat center /100% 100%;
}